<template>
    <div id="bigDiv">
        <div id="tittle">《游戏结束》</div>
        <div id="btn">
          <el-button type="success" size="small" @click="onceAgain">再来一次</el-button>
          <el-button type="success" size="small" @click="goBack">返回首页</el-button>
          <el-button type="success" size="small" @click="lookError">查看细节</el-button>
        </div>
        <div id="bottonTitle">新的数学方法和概念，常常比解决数学问题本身更重要。--华罗庚</div>
      </div>
 
</template>
<script>
export default {
  props:["userScore"],
  data() {
    return {
      isOpend:true
    }
  },
 mounted() {
  this.getEcharts()
  },
  computed:{
    chageRate(){
      var percent = Number(this.userScore.rightRate*100).toFixed(1);
		  percent += "%";
		  return percent;
    }
  },
  methods: {
    onceAgain(){
      this.$emit("onceTime",2)
    },
    goBack(){
      this.$router.push("/home")
    },
    lookError(){
      this.$emit("onceTime",5)
    }
  },
};
</script>

<style lang="less" scoped>
#btn{
  margin-top: -8vh;
}
    #bigDiv{
    width: 85vw;
    height: 65vh; 
    position:absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    background-color: #f1ac9d;
    // opacity: 0.9;
    border-radius: 3px;
    #tittle{
        font-size:20px;
        font-weight: bold;
        letter-spacing: 2px;
        margin-top: 10px;
        position: relative;
        text-indent: 10vw;
    }
    .main{
    width: 85vw;
    height: 58vh;
    margin: -15vh auto;
    transform: scale(0.65);
    }
    #resultAll{
      margin-top: 4vh;
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;
      font-weight: bold;
      div{
        width: 40vw;
        height: 7vh;
      }
    }
    #bottonTitle{
      text-align: right;
      letter-spacing: 1px;
      font-weight: 600;
      width: 70vw;
      margin: 2vh auto;
      font-size: 13px;
      color: rgb(137, 66, 219);
    }
}

</style>